<!DOCTYPE html>
<html lang="en">

    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="./menu.css">
        <link rel="stylesheet" href="./font/iconfont.css">
        <title>小河酱的侧边导航栏</title>
    </head>

    <body>
        <div class="menu-box">
            <div class="emotion-box">
                <i id="emotion1" class="iconfont icon-wukongbiaoqing"></i>
                <i id="emotion2" class="iconfont icon-chenggongbiaoqing"></i>
            </div>
            <ul>
                <li>
                    <a href="#">
                        <i class="iconfont icon-shouye"></i>
                        <p class="content">首页</p>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <i class="iconfont icon-fenlei"></i>
                        <p class="content">分类</p>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <i class="iconfont icon-jilu"></i>
                        <p class="content">记录</p>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <i class="iconfont icon-shezhi"></i>
                        <p class="content">设置</p>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <i class="iconfont icon-wode"></i>
                        <p class="content">我的</p>
                    </a>
                </li>
            </ul>
        </div>
    </body>

</html>